import 'package:cbec_app/components/base/base_image.dart';
import 'package:cbec_app/components/base/image_text_item.dart';
import 'package:cbec_app/components/base/base_nav_bar.dart';
import 'package:cbec_app/components/common/common_style.dart';
import 'package:cbec_app/entity/simple_entity.dart';
import 'package:cbec_app/routes/routes.dart';
import 'package:cbec_app/utils/ThemeConfig.dart';
import 'package:cbec_app/utils/logger.dart';
import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:flutter/widgets.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';
import 'package:get/get.dart';

///商品分类item
class GoodsClassifyItem extends StatefulWidget {
  ///三级分类信息
  final Map? thirdInfo;

  ///商品分类item
  const GoodsClassifyItem({super.key, this.thirdInfo});

  @override
  State<StatefulWidget> createState() => _GoodsClassifyItemState();
}

class _GoodsClassifyItemState extends State<GoodsClassifyItem> {
  ///盒子宽度
  double get boxWidth => 245.w;

  ///分类列表
  List classifyList = [];
  @override
  void initState() {
    super.initState();
    classifyList = widget.thirdInfo?['children'] ?? [];
  }

  @override
  Widget build(BuildContext context) {
    return SingleChildScrollView(
      child: _secondClassify(),
    );
  }

  ///二级分类及其列表
  Widget _secondClassify() {
    return Column(
      crossAxisAlignment: CrossAxisAlignment.start,
      children: [
        ///分类名称
        Container(
          margin: EdgeInsets.only(top: 10.h, bottom: 10.h),
          child: Row(
            children: [
              Container(
                  margin: const EdgeInsets.only(right: 7),
                  child: Text(
                    widget.thirdInfo != null
                        ? widget.thirdInfo!['className']
                        : '',
                    style: setTextStyle(
                        14, FontWeight.bold, ThemeConfig.mainTextColor),
                  )),
              const Icon(
                Icons.navigate_next,
                size: 20,
              )
            ],
          ),
        ),
        SizedBox(
          width: 247.w,
          child: Wrap(
              direction: Axis.horizontal,
              alignment: WrapAlignment.start,
              runSpacing: 10.h,
              children: List.generate(
                  classifyList.length,
                  (index) => _ImageTextItem(
                      index,
                      classifyList[index]['image'],
                      classifyList[index]['className'],
                      classifyList[index]['id'])).toList()),
        )
      ],
    );
  }

  ///图文item
  Widget _ImageTextItem(int index, String url, String text, String id) {
    // logger.d('url $url');
    return ImageTextItem(
      url: url,
      width: 72.w,
      height: 72.w,
      text: text,
      isWrap: true,
      margin: EdgeInsets.only(right: getItemMargin(index)),
      style: setTextStyle(12, FontWeight.w400, ThemeConfig.boldTextColor),
      marginTop: 3,
      onTap: () {
        Get.toNamed(
            '${Routes.filter}/?secondId=${widget.thirdInfo?['id']}&id=$id');
      },
    );
  }

  ///获取图文item间距
  double getItemMargin(int index) {
    return (index + 1) % 3 == 0 ? 0 : 0.w;
  }
}
